<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
<html>
	<head>
		<meta http-equiv="X-UA-Compatible" content="IE=9" />
		<meta http-equiv="content-type" content="text/html; charset=utf-8" />
		<meta property="qc:admins" content="07216227476305205456375" />
		<title>定制</title>
		<link rel="shortcut icon" href="img/W.png" />
<script src="jquery/js/jquery-1.8.2.js"></script>
<script src="jquery/js/jquery-ui-1.9.0.custom.min.js"></script>
<link rel="stylesheet" href="jquery/css/ui-lightness/jquery-ui-1.9.0.custom.min.css" />
		<link rel="stylesheet" type="text/css" href="/css/login.css" />
		<link href="/css/xixiaoming/paticipateDetail.css" rel="stylesheet">
			<link rel="Stylesheet" type="text/css" href="/inc/wColorPicker.css" />
			<link rel="stylesheet" type="text/css"
				href="/css/xixiaoming/fancybox.css" />
		<script type="text/javascript" src="/inc/wColorPicker.js"></script>
			<link href="css/xixiaoming/baidulogin.css" type="text/css"
				rel="stylesheet" />
			<link rel="Stylesheet" type="text/css" href="/wPaint.css" />
			<script type="text/javascript" src="/wPaint.js"></script>
			<script type="text/javascript" src="/js/login.js"></script>
			<script type="text/javascript" src="/js/bgjs/js/script.js"></script>
			<script type="text/javascript" src="/js/customjs/custom.js"></script>
			<script type="text/javascript" src="/js/customjs/product.js"></script>
			<script type="text/javascript" src="/js/product/product_jsp.js"></script>
			<script src="updateProductClickCount?productId=${product.productId}"></script>
			
			<style type="text/css">
body,ul,li {
	padding: 0;
	margin: 0
}

ul,li {
	list-style: none;
}

.img-scroll {
	position: relative;
	margin: 20px auto;
	width: 666px;
	margin-left: 210px;
}

.img-scroll .prev,.img-scroll .next {
	position: absolute;
	display: block;
	width: 50px;
	height: 100px;
	background-repeat: no-repeat;
	margin-top: 48px;
	top: 0;
	color: #FFF;
	text-align: center;
	line-height: 100px;
	color: #FFF;
	text-align: center;
	line-height: 100px; : no-repeat;
	margin-top: 48px;
	top: 0;
	top: 0;
}

.img-scroll .prev {
	left: 0;
	cursor: pointer;
	background-image: url("/js/bgjs/images/custom_selectleft.gif");
}

.img-scroll .next {
	right: 0;
	cursor: pointer;
	background-image: url("/js/bgjs/images/custom_selectright.gif");
}

.img-list {
	position: relative;
	width: 550px;
	height: 100px;
	margin-left: 60px;
	overflow: hidden
}

.img-list ul {
	width: 9999px;
}

.img-list li {
	float: left;
	display: inline;
	width: 100px;
	margin-right: 10px;
	height: 100px;
	text-align: center;
	line-height: 100px;
}

html {
	overflow: scroll;
}

.btn_queding {
	border: solid 1px #666;
	padding: 2px;
	width: 65px;
	filter: progid.DXImageTransform.Microsoft.Gradient (     GradientType = 
		 0, StartColorStr =     #ffffff, EndColorStr =     #ECE9D8 );
}

.button1 {
	border: solid 2px #dcdcdc;
	padding: 4px 14px 4px 34px;
	color: #959595;
	background: url("images/ok.gif") no-repeat 8px center;
	background-color: #f9f9f9;
	font-family: "Arial", "Tahoma", "微软雅黑", "雅黑";
	vertical-align: middle;
	margin: 2px;
	line-height: 18px;
	font-size: 10px;
}

.bx_container {
	width: 530px;
}

ul #example {
	left: -157px;
}

#login_holder_1 p {
	margin: 17px 0;
}

.denglu a {
	background-image: url("/thirdparty/denglu_icon5_all_bg.png");
	font-size: 27px;
}

.denglu .qzone {
	background-position: 0px -300px;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
}

.denglu .renren {
	background-position: 0px -180px;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
}

.denglu .baidu {
	background-position: 0px -450px;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
}

.denglu .sina {
	background-position: 0px -60px;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
}

.denglu .tencent {
	background-position: 0px -90px;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
}

.denglu .qzone {
	background-position: 0px -300px;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
}

.denglu .qzone {
	background-position: 0px -300px;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
}

.denglu .qzone {
	background-position: 0px -300px;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
}

.denglu .taobao {
	background-position: 0px -360px;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
}

.denglu .douban {
	background-position: 0px -240px;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
}
.diypic{
width:100px;
}
</style>
	</head>

	<body style="width: 100%; margin: 0px; padding: 0px;" id="te">
	
		<input type="hidden" value="${productId}" id="productId" />
		<input type="hidden" value="${picdetaillistsize}"
			id="hiddenpicdetaillistsize" />
		<input type="hidden" value="${customId}" id="hiddencustomid" />

		<img src="img/022.gif" id="loading_img"
			style="display: none; position: absolute; z-index: 999;" />
		<div id="fancybox-overlay"
			style="background-color: rgb(119, 119, 119); height: 1823px; opacity: 0.7; cursor: pointer; display: none;"
			onclick="viewclose()"></div>
		<div id="paintBody"
			style="position: absolute; z-index: 1101; display: none; width: 630px; top: 100px; left: 431px; height: auto">
			<div id="wPaint"
				style="position: relative; width: 500px; height: 300px; background: #CACACA; border: solid black 1px; overflow: hidden;">
			</div>
			<br />
			<div style="float: left; margin-left: 50px">
				<input type="button" value="确定" onClick="saveImage()"
					style="border: 0; background-color: #94b8e9" />
				<input type="button" value="清空" onClick="clearCanvas()"
					style="border: 0; background-color: #94b8e9" />
			</div>
		</div>

		<div id="fancybox-wrap"
			style="display: none; width: 630px; top: 88px; left: 431px; height: auto;">
			<div id="fancybox-outer">
				<div class="fancybox-bg" id="fancybox-bg-n"></div>
				<div class="fancybox-bg" id="fancybox-bg-ne"></div>
				<div class="fancybox-bg" id="fancybox-bg-e"></div>
				<div class="fancybox-bg" id="fancybox-bg-se"></div>
				<div class="fancybox-bg" id="fancybox-bg-s"></div>
				<div class="fancybox-bg" id="fancybox-bg-sw"></div>
				<div class="fancybox-bg" id="fancybox-bg-w"></div>
				<div class="fancybox-bg" id="fancybox-bg-nw"></div>
				<div id="fancybox-content"
					style="width: 610px; height: 480px; border-top-width: 10px; border-right-width: 10px; border-bottom-width: 10px; border-left-width: 10px;">
					<img id="fancybox-img" src="" alt="">
				</div>
				<a id="fancybox-close" style="display: block;" onClick="viewclose()"></a>
				<a href="javascript:;" id="fancybox-left" style="display: none;">
					<span class="fancy-ico" id="fancybox-left-ico"></span> </a>
				<a href="javascript:;" id="fancybox-right" style="display: none;">
					<span class="fancy-ico" id="fancybox-right-ico"></span> </a>
				<div id="fancybox-title" class="" style="display: none;"></div>
				<br />
				<input type="button" value="保存到购物车"
					style="border-style: dashed; font-size: 15"
					onClick="getCustomName()" />
				&nbsp;&nbsp;&nbsp;&nbsp;
				<input type="button" value="直接付款"
					style="border-style: dashed; font-size: 15"
					onClick="payForCustom()" />
			</div>
		</div>
		<!--	<jsp:include page="top.jsp"></jsp:include>  -->
        <!--\#include file="top.jsp" -->
		<div style="width: 1100px; height: 50px;"></div>
		<div id="custom_content">

			<div id="leftSelectDiv"
				style="top: 82px; display: block; width: 0px; position: absolute; z-index: 900; padding: 0px; outline: 0; border: 0px solid #a0b3d6; word-wrap: break-word; float: left; text-align: left; left: 236px;">
				<div id="leftlist"
					style="top: 48px; width: 148px; position: relative;border-style:solid;border-width:1px;border-color:#A8D9E9;">
					<div id="typeSelect">
						<img src="img/chexing1.png" onclick="hideTypeSelect()" />
						<div style="height: 460px; overflow-y: auto; width: 148px;">
							<table width="100%">
								#foreach($fli in $list)
									<tr><td width="16%">
										<img style="cursor:pointer;" id="tupian${fli.brandsId}" onclick="zhan1(${fli.brandsId})" src="img/nolines_plus.gif" />
										</td><td>
										<a onclick="zhan1(${fli.brandsId})" href="javascript:void(0);" style="color:black;font-size:11px;font-family:微软雅黑;">${fli.brandsName}</a></td></tr><tr><td colspan="2">
										<div id="second${fli.brandsId}" style="display: none;" isclick="false">
											<ul id="uu${fli.brandsId}"></ul>
										</div></td>
									</tr>
								#end
							</table>
						</div>
					</div>
				</div>
			</div>
			<div id="bg"
				style="border:1px solid #A8D9E9;left:385px;background:url('/${bgPic}') no-repeat scroll center bottom transparent;width: 640px;height: 480px;float: left;position: relative;">
				#set($tt=0)
				#foreach($p in $picdetaillist)
					<div id="divv${tt}"
						style="position:absolute;left:${p.left}px;top:${p.top}px;width:${p.width}px;height:${p.height}px">
						<div style="height: 10px; display: block" id="chacha${tt}">
							<img id="imgc${tt}" src="img/cancel_03.png" value="${tt}"
								style="display: block; position: relative; left: -10px; float: left; width: 12px; height: 10px;" />
						</div>
						<input type="hidden" value="1" id="flag${tt}" name="flagname" />
						#set($tt = $tt + 1)
						<img id="imgg${tt}" src="/${p.picUrl}"
							style="width:${p.width}px;height:${p.height}px;" />
					</div>
				#end
				<img id="openchexing"
					onclick="$('#leftlist').slideDown('slow');$('#openchexing').hide();"
					src="img/chexing.png"
					style="display: none; position: absolute; top: 0px; left: -20px;" />
				<img
					style="position: absolute; top: 433px; left: 633px; display: none;"
					src="img/gongju.png"
					onclick="$('#tooltip').slideDown('slow');$('#opengongju').hide();"
					id="opengongju" />

			</div>
			<div id="tooltip"
				style="float: left; clear: both; position: absolute; float: left; left: 1026px; top: 130px;">
				<img src="img/custom_type.gif"
					onclick="$('#tooltip').slideUp('slow');$('#opengongju').show();"
					style="border-left: #A8D9E9 solid 1px; border-right: #A8D9E9 solid 1px; border-top:#A8D9E9 solid 1px;"/>
				<div id="custom_choose"
					style="width: 148px; position: relative; height: 460px; border-left: #A8D9E9 solid 1px; border-right: #A8D9E9 solid 1px; border-bottom: #A8D9E9 solid 1px;">
					<input type="button"
						style="border: 0; background-color: transparent; background-image: url(img/tuan.png); width: 148px; height: 20px;"
						value="" onclick="showUpload()" />
					<div id="Carpic" style="height: 332px; overflow-y: auto">
						<img src="img/a.png" class="diypic" 
							onclick="add('img/a.png')" />
						<img src="img/b.png" class="diypic" 
							onclick="add('img/b.png')" />
						<img src="img/c.png" class="diypic" 
							onclick="add('img/c.png')" />
						<img src="img/d.png" class="diypic" 
							onclick="add('img/d.png')" />
						<img src="img/e.png" class="diypic" 
							onclick="add('img/e.png')" />
						<img src="img/f.png" class="diypic" 
							onclick="add('img/f.png')" />
						<img src="img/g.png" class="diypic" 
							onclick="/add('img/g.png')" />
					</div>
					<form id="addword" method="post">
						<div style="float: left; width: 40px;">
							<div onClick="coloropen(event)" id="custom_color"
								style="width: 40px; height: 15px; cursor: pointer; border: 1px solid #000; float: right; margin-top: 4px;">
								<table id="tabletable" style="width: 40px; height: 15px;">
									<tr>
										<td style="background: black;">
										</td>
										<td style="background: grey;">
										</td>
										<td style="background: white;">
										</td>
									</tr>
								</table>
							</div>
							<div id="colorpane"
								style="position: absolute; z-index: 999; display: none;"></div>
							<input type="hidden" name="color" value="rgb(0, 0, 0)" />
						</div>
						<select id="fontfamilyselect" name="family"
							style="width: 55px; height: 20px">
						</select>
						<select onChange="changeSelectSize(this.value)" id="sizeselect"
							style="float: right; width: 45px; height: 20px">
						</select>
						<input type="text" name="size" id="fontsize" value="88"
							onblur="javascript:if(this.value==''){alert('请选择字体大小！');this.value='88';}"
							style="width: 25px; height: 14px; position: relative; top: -20px; left: 22px;" />
						<textarea name="word" id="word"
							style="width: 140px; height: 40px; margin-top: -18px; font-size: 12px; resize: none; color: #8a8a8a;"
							onfocus="inputWordFocus()">请输入自定义文字</textarea>
						<input type="button"
							style="float: left; border: 0; background-color: transparent; background-image: url(img/wordqueding.png); width: 148px; height: 20px;"
							value=" " onclick="checkaddword()" />
					</form>
					<div id="uploaddiypicture">
						<form action="picupload.action" id="form1" name="form1"
							encType="multipart/form-data" method="post" target="hidden_frame"
							style="text-align: left; font-size: 14px;">
							<input type="text" id="txt" name="txt"
								style="position: relative; left: 0px; width: 140px; top: 5px; height: 24px; border: 0;"
								value="点击此处选择图片" />
							<input type="file" id="file" onchange="txt.value=this.value"
								name="myfile" size="17px"
								style="width: 200px; height: 24px; position: relative; left: 0; top: -19px; filter: alpha(opacity = 0); -moz-opacity: 0; opacity: 0;" />
							<input type="submit" value="上传"
								onmouseover="this.style.borderColor='#75cd02';"
								onmouseout="this.style.borderColor='#dcdcdc';" class="button1"
								style="position: relative; left: 133px; width: 65px; top: -43px; height: 24px" />
							<iframe name='hidden_frame' id="hidden_frame"
								style="display: none;"></iframe>
						</form>
					</div>
					<script type="text/javascript">
							function callback() {
								document.getElementById("file").outerHTML = document.getElementById("file").outerHTML;
							}
						</script>
					<img src="img/shoppingcar.png"
						style="width: 148px; height: 20px; cursor: pointer;"
						onclick="yulan()" />
				</div>
			</div>

			<div style="height: auto">
				#if($bgpiclist)
					<div
						style="margin-left: 169px; clear: both; position: absolute; width: 1050px; top: 648px;">
						
						<div class="img-scroll">
							<span class="prev"></span>
							<span class="next"></span>
							<div class="img-list">
								<ul>
									#foreach($bg in $bgpiclist)
										<li>
											<img style="width: 100px; height: 100px;" src="/${bg.picUrl}"
												onclick="changeBg('${bg.picUrl}');"/>
										</li>
										#set($imgLength = $index)
									#end
								</ul>
								<input type="hidden" id="imgLength" value="${imgLength}" />
							</div>
						</div>
						<div id="otherProducts" style="position: relative;">


						</div>
						<div id="json" style="display:none;">${product.autoLogos}</div>
						<div
							style="text-align: left; width: 900px; overflow: hidden; position: relative; margin-left: 20px;"
							id="productDesc">
							<h2>产品介绍：</h2>
								${product.productDesc}
						</div>
						<div id="shareDiv" style="">
							<h1>
								此款产品：
							</h1>
						</div>
						<div id="test" style="margin-left: -14%;">
							<!--\#include file="bottom.jsp" -->
						</div>
					</div>
               #else
               #end
			</div>

		</div>

		<input type="hidden" value="" id="forname" />
		<div id="inputdesignmsg">
			<fieldset>
				请给你的设计取个名字：
				<input type="text" id="inputcustomname"
					class="text ui-widget-content ui-corner-all" value="${customname}" />
				<br />
				您也可以给您的设计添加备注：
				<input type="text" id="inputcustomcontent"
					class="text ui-widget-content ui-corner-all"
					value="${customcontent}" />
				<br />
				<br />

			</fieldset>
			<input type="button" onclick="inputCustomMsgButton()" value="确定"
				class="btn_queding" />
		</div>
		
	</body>
</html>
